import React, { Component } from 'react';

import { Get, Post } from '../../core/utils/fetch';
import Dialog from '../../core/utils/dialog';
import Header from '../../core/components/header';
import FormInput from '../../core/components/form.input';
import FormTextarea from '../../core/components/form.textarea';

const idMatch = /id=(\d+)/
class ProductEdit extends Component {

    static contextTypes = {
        router: React.PropTypes.object.isRequired
    };

    id = ""

    constructor(props) {
        super(props);
        let m = idMatch.exec(props.location.search);
        if (m) {
            this.id = m[1];
        }
    }

    state = {
        productData: {},
    };

    componentDidMount = () => {
        this._refresh();
    };

    render() {
        let { productData } = this.state;
        return (
            <div>
                <Header title="理财产品" subTitle="Money Manage"></Header>

                <div className="row">
                    <div className="col-lg-4">
                        <h2>产品编辑</h2>
                        <form role="form">
                            <input type="hidden" id="product-id" />
                            <FormInput
                                className="has-success"
                                label="产品名称*"
                                name="name"
                                dataItem={productData}
                                extra={<label className='extra-label'>至多8个汉字</label>}></FormInput>
                            <FormInput
                                className="has-success"
                                label="投资期限(个月)*"
                                name="period"
                                dataItem={productData}
                                extra={<label className='extra-label'>只能填写大于等于1的整数</label>}></FormInput>
                            <FormInput
                                className="has-success"
                                label="起投金额(万元)*"
                                name="startUpNum"
                                dataItem={productData}
                                extra={<label className='extra-label'>只能填写大于等于1的整数</label>}></FormInput>
                            <FormInput className="has-success" label="收益率*" name="rate" dataItem={productData}></FormInput>
                            <FormTextarea
                                className="has-success"
                                label="产品描述"
                                name="description"
                                dataItem={productData}
                                extra={<label className='extra-label'>限制200个汉字</label>}/>
                            <FormTextarea
                                className="has-success"
                                label="收益方式"
                                name="incomeMethod"
                                dataItem={productData}
                                extra={<label className='extra-label'>限制50个汉字</label>}/>
                            <FormTextarea
                                className="has-success"
                                label="适宜人群"
                                name="suitCrowds"
                                dataItem={productData}
                                extra={<label className='extra-label'>限制50个汉字</label>}/>
                        </form>
                        <div className="color-green">
                            带*为必填项
                        </div>
                        <button type="button" className="btn btn-sm btn-primary" onClick={this._save}>保存</button>
                    </div>
                </div>
            </div>
        );
    }

    _refresh = () => {
        if (this.id) {
            Get(`/spi/product/info/${this.id}`)
                .then((productData) => {
                    this.setState({ productData });
                });
        } else {
            this.setState({
                productData: {
                    "interestLevelList": [],
                }
            })
        }
    };
    _save = () => {
        let { productData } = this.state;
        Post(productData.id ? '/spi/product/update' : '/spi/product/add', productData)
            .then((r) => {
                Dialog.alert(productData.id ? '更新成功' : '新增成功', () => {
                    this.context.router.history.goBack();
                });
            });
    };
}

export default ProductEdit;